﻿@{
    Layout = null;
}

<head>
    <meta name="viewport" content="width=device-width" />
    <title>登录-文件浏览系统</title>
    <script src="~/Scripts/jquery-3.4.1.min.js"></script>
    <link href="~/Content/layui-v2.8.15/layui/css/layui.css" rel="stylesheet" />
    <script src="~/Content/layui-v2.8.15/layui/layui.js"></script>
    <script src="~/Content/layui-v2.8.15/layui/axios.min.js"></script>
</head>


<style>
    .demo-login-container {
        width: 320px;
        position: absolute;
        /*居中显示*/
        top: 28%;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
    }

    .demo-login-other .layui-icon {
        position: relative;
        display: inline-block;
        margin: 0 2px;
        top: 2px;
        font-size: 26px;
    }
</style>

<form class="layui-form">

    <div class="demo-login-container box">
        <h1 style="text-align:center;margin-bottom:30px;">文件浏览系统</h1>
        <div class="layui-form-item">
            <div class="layui-input-wrap">
                <div class="layui-input-prefix">
                    <i class="layui-icon layui-icon-username"></i>
                </div>
                <input type="text" id="account" name="username" value="" lay-verify="required" placeholder="用户名" lay-reqtext="请填写用户名" class="layui-input" lay-affix="clear">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-wrap">
                <div class="layui-input-prefix">
                    <i class="layui-icon layui-icon-password"></i>
                </div>
                <input type="password" id="password" name="password" value="" lay-verify="required" placeholder="密   码" lay-reqtext="请填写密码" autocomplete="off" class="layui-input" lay-affix="eye">
            </div>
        </div>


        <div class="layui-form-item">
            <button class="layui-btn layui-btn-fluid" lay-submit lay-filter="demo-login">登录</button>

        </div>
        <div class="layui-form-item">
            <button class="layui-btn layui-btn-fluid" type="button" onclick="DoRegister()">注册</button>

        </div>

    </div>
</form>

<script>
    layui.use(function () {
        var form = layui.form;
        var layer = layui.layer;
        // 提交事件
        form.on('submit(demo-login)', function (data) {
            var field = data.field; // 获取表单字段值
            axios.post('/LoginHandle/DoLogin',  new URLSearchParams({
    account: field.username,
    pwd: field.password
}))
.then(function (response) {
    if (response.data.Code == 200) {
        localStorage.setItem('jwtToken', response.data.Msg);
        layer.msg("登陆成功");
        window.location.href = "/Home/Index";
    } else {
        layer.msg(response.data.Msg);
    }
})
.catch(function (error) {
    console.error(error);
});
            return false;
        });

    });
    async function DoRegister() {
        // 获取表单数据
        const field = {
            username: $('#account').val().trim(),
            password: $('#password').val().trim()
        };

        // 验证输入（根据需要添加更多验证规则）
        if (!field.username || !field.password) {
            layer.msg('用户名和密码不能为空');
            return false;
        }

        const response = await fetch('/LoginHandle/DoRegister', {
            method: 'POST',
            body: new URLSearchParams({
                account: field.username,
                pwd: field.password
            })

        });

        if (!response.ok) {
            throw new Error('网络响应失败');
        }

        // 解析 JSON 响应
        const responseData = await response.json();

        // 处理响应
        switch (responseData.Code) {
            case 200:
                layer.msg(responseData.Msg);
                // 成功后可能需要重定向或执行其他操作
                break;
            case 500:
                layer.msg(responseData.Msg);
                break;
            default:
                layer.msg('未知错误，请稍后再试');
        }

        return false;
    };
</script>



